<template lang="">
    <div class="planexlist">
        {{ plname }} 执行记录
        <el-table :data="planexrecord" style="width: 100%" stripe border>
            <el-table-column type="index" label="序号" width="50"> </el-table-column>
            <el-table-column prop="id" label="执行编号" width="80"> </el-table-column>
            <el-table-column prop="excutnum" label="执行批次" width="180">
            </el-table-column>
            <el-table-column prop="caseCount" label="用例总数" width="80">
            </el-table-column>
            <el-table-column prop="passCount" label="通过条数" width="80">
            </el-table-column>
            <el-table-column prop="failCount" label="失败条数" width="80">
            </el-table-column>

            <el-table-column  label="响应时间" align="center">
                <el-table-column prop="thrCount" label="0.3s<=t<0.5s" width="120"></el-table-column>
                <el-table-column prop="sevCount" label="0.5s<=t<1s" width="115"></el-table-column>
                <el-table-column prop="secCount" label="1s<= t" width="100"></el-table-column>
            </el-table-column>
            
            <el-table-column prop="passRatio" label="通过率" width="180">
            </el-table-column>
            <el-table-column prop="" label="执行时间" width="180">
              <template slot-scope="scope">
                <span style="margin-left: 10px">{{
                  myDate(scope.row.create_time)
                  }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="create_user" label="执行者" width="80">
            </el-table-column>
            <el-table-column label="操作" >
              <template slot-scope="scope">
                <el-tooltip class="item" effect="dark" content="测试结果" placement="top-start">
                  <el-button type="success" icon="el-icon-s-operation" circle size="mini"
                    @click="viewReports(scope.row.excutnum, scope.row.planid_id)">
                  </el-button>
                </el-tooltip>
              </template>
            </el-table-column>
          </el-table>
          <PlanCaseReports ref="plaReport" />
    </div>
</template>
<script>
    import { myDate } from "@/assets/js/common"
    import { getPlanExRecord } from "@/network/networks"
    import PlanCaseReports from "./planChildrem/PlanCaseReports"
export default {
    components: {
        PlanCaseReports,
    },


    data() {
        return{
            planid: null,
            plname: "",
            planexrecord: []
        }
    },

    mounted() {
        this.planid = this.$route.params.planid;
        this.plname = this.$route.params.plname;
        this.getPlanrecord();
    },

    methods: {
        
        getPlanrecord() {
            getPlanExRecord({
                planid: this.planid
            })
            .then(res=>{
                if(res.code==1){
                    this.planexrecord = res.data
                    this.repassRatio()
                }else(
                    this.$message.error(res.msg)
                )
            })
            .catch(err=>{
                this.$message.error(res.msg)
            })
        },


        repassRatio() {
            console.log(this.planexrecord)
            console.log(this.planexrecord.length)
            for(var i = 0; i < this.planexrecord.length; i ++) {
                console.log(this.planexrecord[i])
                this.planexrecord[i].passRatio = Math.round(this.planexrecord[i].passCount / this.planexrecord[i].caseCount * 10000) / 100.00 + "%"
                if (this.planexrecord[i].passRatio == 'NaN%'){
                    this.planexrecord[i].passRatio = 0
                }
            }
        },

//Math.round(this.planexrecord.passCount / this.planexrecord.caseCount * 10000) / 100.00 + "%")
        viewReports(excutnum, planid) {
            console.log(excutnum)
            console.log(planid)
            this.$refs.plaReport.excutnum = excutnum;
            this.$refs.plaReport.planid = planid;
            this.$refs.plaReport.showDialog = true;
        },

        myDate(time){
            return myDate(time);
        }
    },


}
</script>
<style lang="less" scoped>
.el-table .cell{
         white-space:pre-line;
     }
</style>